<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>计算属性</title>
	<script type="text/javascript" src="js/vue.js" ></script>
	</head>
	<body>
		<div id="app">
			{{fullname}}
		</div>
		<script>
         var app = new Vue({
         	el:"#app",
         	data:{
             firstname:"Mr",
             lastname:"man"
         	},
         	/*computed:{
         		fullname:function(){
         			return this.firstname + " " + this.lastname;
         		}
         	},*/
         	computed:{
         		fullname:{
         			get:function(){
         					return this.firstname + " " + this.lastname;
         			},
         			set:function(value){
         				var arr = value.split(" ");
         				this.firstname = arr[0];
         				this.lastname = arr[1];
         			}
         		}
         	}
         })
         /*计算属性,依赖的值发生改变才会重新计算,否则将不会重新计算,他会把每次计算缓存起来*/
		</script>
	</body>
</html>
